<template>
	<el-dialog :model-value="props.visible" :title="title" width="80%" :before-close="close">
		<div v-if="props.type == 'table'">
			<HyTable
				ref="hyTable"
				@sendSelectValue="getSelectValue"
				v-if="props.visible"
				:searchFields="props.searchFields"
				:searchDefault="props.searchDefault"
				:tableConfig="tableConfig"
				:tableColumns="props.tableColumns"
			>
				<template #singleSlot="{ row }">
					<el-radio-group v-model="selectValue.index">
						<span v-for="item in options" :key="item">
							<el-radio :value="item" v-if="item === row.index" />
						</span>
					</el-radio-group>
				</template>
				<template #indexSlot>
					<el-table-column fixed="left" type="index" label="序号" width="80" />
				</template>
			</HyTable>
		</div>
		<div v-if="props.type == 'form'">
			<HyForm ref="hyForm" :hyFormConfig="searchConfig" :hyFormDefault="props.searchDefaultForm" :hyFormFields="props.searchFieldsForm"></HyForm>
		</div>
		<template #footer>
			<div class="dialog-footer">
				<el-button @click="close">取消</el-button>
				<el-button type="primary" @click="sendData"> 确定 </el-button>
			</div>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
import HyTable from '/@/components/HyTable/index.vue';
import HyForm from '/@/components/HyForm/index.vue';
import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
import { appListApi } from '/@/api/threeList/declare';
import { getThreeList, dataModifySubmitApplication } from '/@/api/digitalList/digitalLization';
const props = defineProps({
	visible: {
		type: Boolean,
		default: () => {
			return false;
		},
	},
	title: {
		type: String,
		default: () => {
			return '';
		},
	},
	type: {
		type: String,
		default: () => {
			return '';
		},
	},
	tableColumns: {
		type: Array,
		default: () => {
			return [];
		},
	},
	searchFields: {
		type: Object,
		default: () => {
			return {
				name: {
					label: '关键字',
					type: 'input',
				},
			};
		},
	},
	searchFieldsForm: {
		type: Object,
		default: () => {
			return {};
		},
	},
	searchDefault: {
		type: Object,
		default: () => {
			return {
				type: '1',
			};
		},
	},
	searchDefaultForm: {
		type: Object,
		default: () => {
			return {
				applyReason: '',
			};
		},
	},
	updateData: {
		type: Object,
		default: () => {
			return {};
		},
	},
});
const title = computed(() => {
	return props.title;
});

watch(
	() => props.title,
	(val) => {
		if (val == '请选择关联应用') {
			requestList.value.request = appListApi;
		}
	}
);
watch(
	() => props.updateData,
	(val) => {
		if (val) {
			declareId.value = val.declareId;
		}
	}
);
const options = computed(() => {
	let arr = [];
	for (let index = 0; index < 10; index++) {
		arr.push(index);
	}
	return arr;
});
const emits = defineEmits(['close']);
const close = () => {
	emits('close');
};
const hyTable = ref();
const hyForm = ref();
const declareId = ref();
const requestList = ref({
	request: getThreeList,
	singleSelect: true,
});
const tableConfig = computed(() => {
	return requestList.value;
});
//获取选择
const selectValue = ref<any>({
	indexe: null,
});
const updateValue = ref({
	is: true,
});

const getSelectValue = (value: any) => {
	selectValue.value = value || {
		indexe: null,
	};
};
const type = ref(1);
//确定
const sendData = () => {
	const index = selectValue.value.index;
	type.value = title.value == '请选择方案中的运维项目' ? 2 : 1;
	switch (title.value) {
		case '申请修改':
			hyForm.value.check().then((valid?: any) => {
				if (valid) {
					const loading = ElLoading.service({
						lock: true,
						text: '提交中...',
					});
					const data = {
						businessKey: declareId.value,
						businessType: '2',
						...hyForm.value.hyForm,
					};
					dataModifySubmitApplication(data)
						.then((res) => {
							// ElMessage({
							// 	type: res.code == 0 ? 'success' : 'warning',
							// 	message: res.msg,
							// });
							const data = {
								flowName: res?.data?.flowName,
								businessKey: res?.data?.businessKey,
							};
							updateValue.value = { ...updateValue.value, ...data };
							emits('close', updateValue.value);
							//重置
						})
						.finally(() => {
							loading.close();
						});
				}
			});
			break;

		default:
			if (index || index == 0) {
				emits('close', { ...selectValue.value, type: type.value });
			} else {
				ElMessage({
					type: 'warning',
					message: '请选择项目',
				});
			}
			break;
	}
};
//表单
const searchConfig = ref({
	labelWidth: '120px',
	span: 6,
	offset: 0,
	type: 'submit',
});
</script>

<style scoped lang="scss"></style>
